@mixin css3($property, $value) {
	-khtml-#{$property}: $value;
	-webkit-#{$property}: $value;
	-moz-#{$property}: $value;
	-ms-#{$property}: $value;
	-o-#{$property}: $value;
	#{$property}: $value;
}

body {
    font-family: 'Open Sans', sans-serif;
}

.white-popup{
	background: #fff;
	padding: 20px;
	text-align: center;
	width: 50%;
	margin: 0 auto;
	@include css3(border-radius, 5px);
}

#w0{
	border: none;
	border-top: 4px solid #6db33f;
	margin: 0;
	background-color: #34302d;

	.navbar-brand{
		height: 70px;
		line-height: 35px;
	}
	
	#w1{
		li{			
			height: 70px;


			a{
				height: 100%;
				line-height: 35px;
				color: #eeeeee;
				font-size: 17px;
			}
		}

		li:hover, li.active{
			background-color: #5fa134;
			a{
				background-color: #5fa134;
			}
		}
	}
}

#top-slider{
	.carousel-inner{
		.item{
			img{
				height:360px;
				width: 100%;
			}
		}
	}
}

.mail-sign-benefit{
	margin:0 ;
	background-color: #f1f1f1;
	position: relative;
	box-shadow: 1px 1px 2px #ccc;

	ul{
		/*@include css3(transform, rotate(4.2deg));*/
		margin: 0;
		padding: 0;
		padding-top: 50px;


		li{	
			position: relative;
			list-style-type: none;
			padding: 20px;
			margin: 20px 0;
			color: #fff;
		}

		li:first-of-type{
			background:#96281B;
		}

		li:nth-child(2){
			background:#663399;
		}

		li:nth-child(3){
			background:#674172;
		}

		li:nth-child(4){
			background:#446CB3;
		}

		li:nth-child(5){
			background:#049372;
		}

		li:nth-child(6){
			background:#D35400;
		}
	}

}

.index-container{
	padding: 0;

	.jumbotron{
		border-radius: 0;
		background-color: #666;
		border-bottom: 1px solid #34302D;
		padding-bottom: 100px;
		margin-bottom: 0;

		h5{
			border-top: 4px solid #6db33f;
			color: #ebf1e7;
			display: inline;
			padding: 5px 0;
			font-size: 13px;
		}

		.p-title{
			font-size: 24px;
			padding: 20px 0;
			color: #ebf1e7;
		}

		.p-desc{
			font-size: 15px;
			color: #f1f1f1;
		}

		.fa-github{
			color: #ebf1e7;
			font-size: 36px;
			cursor: pointer;
			margin-right: 10px;
		}

		.fa-github:hover{
			color: #6db33f;
		}

		.fa-github-alt{
			font-size: 250px;
			color: #BFBFBF;
		}
	}

	.index-top{
		margin: 20px;

		.bx-wrapper .bx-viewport{
			box-shadow: none;
		}

		.bx-controls-direction a{
			z-index: 1000;
		}

		.mail-sign-example{
		
		}
	}
}

.share-div{

	.fa{
		display: inline-block;
		background: #161616;
		color: #fff;
		font-size: 14px;
		width: 30px;
		line-height: 30px;
		text-align: center;
		margin-left: 20px;
		text-decoration: none;
		@include css3(transition, all 0.6s);
	}

	.fa:hover {
	  	background: #6db33f;
	}
}

.index-mid{
	background: #fff;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 50px 0 20px;

	.email-tpl-wrap{
		margin-bottom:50px;
		float: left;

		.e-t-w-t1{
			margin-top: 5px;
		}

		.edit-email-tpl{
			position: absolute;
			right: 10px;
			bottom: 10px;
			font-size: 16px;
			cursor: pointer;
			display: none;
			@include css3(transition, all 0.6s);
			color: #333;
			font-weight: bold;
		}

		.fa-loader{
			position: absolute;
			right: 10px;
			top: 10px;
			font-size: 36px;
			color: #333;
			display: none;
		}

		.edit-email-tpl:hover{
			color: #446CB3;
		}

		a:hover{
			text-decoration: none;
		}
	}

	.email-tpl-wrap:hover{
		.edit-email-tpl{
			display: inline-block;
		}
	}

	.edit-ele[contenteditable=true]{
	  	padding: 0px 8px 0 0px;
	  	border-bottom: 1px solid #ccc;
	  	outline: 0;
	  	margin-bottom: 2px;
	}
}

.gen-sig-content{
	width: 100%;
	height: 300px;
	outline: 0;
	font-size: 12px;
	line-height: 1.5;
	@include css3(border-radius, 3px);
	background: #f1f1f1;
	border: 0;
	padding: 10px;
	cursor: text;
}


/* clear fix */
.index-mid:after {
  content: '';
  display: block;
  clear: both;
}


.footer{
	background-color: #34302d;
	color: #eeeeee;
	padding: 30px 0;
}

.contact-wrap{
	#map-canvas{
		width:100%;
		height:600px;
		border: 1px solid #ccc;
	}

	#save-widget {
		width: 300px;
		box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px;
		background-color: white;
		padding: 10px;
		font-family: Roboto, Arial;
		font-size: 13px;
		margin: 15px;
	}
}

.form-control, .btn{
	border-radius: 0;
}

.about-wrap{
	min-height: 750px;
}